<script>
import { ref, onMounted } from 'vue'
import { useStore } from 'vuex'

export default {
  name: 'AdminView',
  setup() {
    const store = useStore()
    const activeTab = ref('users')
    const loading = ref(false)
    const error = ref('')

    // 用户管理
    const users = ref([])
    const userSearchQuery = ref('')
    const userPage = ref(1)
    const userTotalPages = ref(1)

    // 歌曲管理
    const songs = ref([])
    const songSearchQuery = ref('')
    const songPage = ref(1)
    const songTotalPages = ref(1)

    // 系统设置
    const settings = ref({
      siteName: '听友音乐曲库管理系统',
      allowRegistration: true,
      maxUploadSize: 10,
      allowedFileTypes: ['mp3', 'wav', 'flac'],
      maintenanceMode: false,
    })

    const fetchUsers = async () => {
      loading.value = true
      error.value = ''
      try {
        const { users: userList, totalPages } = await store.dispatch('admin/fetchUsers', {
          page: userPage.value,
          search: userSearchQuery.value,
        })
        users.value = userList
        userTotalPages.value = totalPages
      } catch (err) {
        error.value = '获取用户列表失败'
      } finally {
        loading.value = false
      }
    }

    const fetchSongs = async () => {
      loading.value = true
      error.value = ''
      try {
        const { songs: songList, totalPages } = await store.dispatch('admin/fetchSongs', {
          page: songPage.value,
          search: songSearchQuery.value,
        })
        songs.value = songList
        songTotalPages.value = totalPages
      } catch (err) {
        error.value = '获取歌曲列表失败'
      } finally {
        loading.value = false
      }
    }

    const handleUserAction = async (userId, action) => {
      try {
        if (action === 'edit') {
          // 编辑逻辑
        } else if (action === 'delete') {
          await store.dispatch('admin/deleteUser', userId)
          fetchUsers()
        }
      } catch (err) {
        error.value = '操作失败，请重试'
      }
    }

    const handleSongAction = async (songId, action) => {
      try {
        if (action === 'edit') {
          // 编辑逻辑
        } else if (action === 'delete') {
          await store.dispatch('admin/deleteSong', songId)
          fetchSongs()
        }
      } catch (err) {
        error.value = '操作失败，请重试'
      }
    }

    const saveSettings = async () => {
      try {
        await store.dispatch('admin/updateSettings', settings.value)
        error.value = ''
      } catch (err) {
        error.value = '保存设置失败'
      }
    }

    onMounted(() => {
      fetchUsers()
      fetchSongs()
    })

    return {
      activeTab,
      loading,
      error,
      users,
      userSearchQuery,
      userPage,
      userTotalPages,
      songs,
      songSearchQuery,
      songPage,
      songTotalPages,
      settings,
      handleUserAction,
      handleSongAction,
      saveSettings,
    }
  },
}
</script>

<template>
  <!-- ...模板同之前... -->
</template>

<style scoped>
/* ...样式同之前... */
</style>
